<template>
  <div class="box">
    <div>
      <van-search v-model="value" shape="round" background="#4fc08d" placeholder="请输入搜索关键词"/>
    </div>
    <van-card v-for="item in data" :key="item.id" :num="num" :price="item.price" :desc="item.details" :title="item.title"
      :thumb="item.img" origin-price="10.00"  @click="xiang(item)"/>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { useRoute, useRouter} from 'vue-router';
const $route = useRoute()
const $router = useRouter()

let data = ref([...JSON.parse($route.query.data)])
let value = ref(JSON.parse($route.query.val))

let xiang=(data)=>{
let { img,img1,price,title,num,id } =data
$router.push({
  path:'/details',
  query:{
    img,img1,price,title,num,id
  }
})
}

</script>

<style scoped>
.box{
  background-color:#c4dc6f;
}
</style>